<template>
  <div>
    <!--面包屑导航区域-->
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>个人信息</el-breadcrumb-item>
      <el-breadcrumb-item>个人信息管理</el-breadcrumb-item>
    </el-breadcrumb>
<!--    <el-descriptions  direction="vertical" :column="1" border>-->
<!--      <el-descriptions-item label="用户名">chenjin</el-descriptions-item>-->
<!--      <el-descriptions-item label="密码">123456</el-descriptions-item>-->
<!--      <el-descriptions-item label="手机号">18408188863</el-descriptions-item>-->
<!--      <el-descriptions-item label="邮箱">2714282649@qq.com</el-descriptions-item>-->

<!--&lt;!&ndash;      <el-descriptions-item label="备注">&ndash;&gt;-->
<!--&lt;!&ndash;        <el-tag size="small">学校</el-tag>&ndash;&gt;-->
<!--&lt;!&ndash;      </el-descriptions-item>&ndash;&gt;-->
<!--&lt;!&ndash;      <el-descriptions-item label="联系地址">江苏省苏州市吴中区吴中大道 1188 号</el-descriptions-item>&ndash;&gt;-->
<!--      <template slot="extra">-->
<!--        <el-button type="primary" size="small">操作</el-button>-->
<!--      </template>-->
<!--    </el-descriptions>-->
    <el-form :label-position="labelPosition" label-width="80px" :model="formLabelAlign" size="large">
      <el-form-item label="用户名">
        <el-input class="input-reader-name" v-model="formLabelAlign.username"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input class="input-reader-name" v-model="formLabelAlign.password"></el-input>
      </el-form-item>
      <el-form-item label="手机号">
        <el-input class="input-reader-name" v-model="formLabelAlign.phone"></el-input>
      </el-form-item>
      <el-form-item label="邮箱">
        <el-input class="input-reader-name" v-model="formLabelAlign.email"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">修改信息</el-button>
      </el-form-item>
<!--      <el-form-item>-->
<!--        <div slot="footer" >-->
<!--          <el-button type="primary" @click="onSubmit">修改信息</el-button>-->
<!--        </div>-->
<!--      </el-form-item>-->
    </el-form>
  </div>
</template>

<script>
export default {
  created () {
    this.formLabelAlign.username = this.Global.globalUser.globalName
    this.formLabelAlign.password = '123456'
    this.formLabelAlign.phone = this.Global.globalUser.globalPhone
    this.formLabelAlign.email = '2714282650@qq.com'
  },
  data () {
    return {
      labelPosition: 'top',
      formLabelAlign: {
        username: '',
        password: '',
        phone: '',
        email: ''
      }
    }
  },
  methods: {
    onSubmit () {
      this.$message.success('修改个人信息成功')
    }
  }
}
</script>

<style lang="less" scoped>
::v-deep .input-reader-name{
  width: 40%;
}
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both
}

.box-card {
  width: 100%;
}
</style>
